<script  setup>
import Card from "../../help/Card.vue";
import { EchartsOptions } from "../../help/index.js";
import { nextTick,ref } from "vue";
import * as echarts from 'echarts'

const id = ref(Math.random().toString(36).substring(2, 9))

const option = {
  tooltip: {

  },
  xAxis: {
    type: 'category',
    data: ['登陆时长','测试','资源查看'],
  },
  grid: {
    left: '10%',
    top: '20%',
    right: '0%',
    bottom: '20%',
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [90, 93, 90, 78, 100, 59, 100],
      type: 'line',
      smooth: true
    }
  ]
}

nextTick(() => {
  EchartsOptions(option, id.value)
})
</script>

<template>
  <Card title="线上学习情况" class="basis-2/7 w-full h-full animate__animated animate__fadeInTopRight">
    <div class="w-full h-full" :id="id"></div>
  </Card>
</template>
